<template>
  <div>
      <div class="tuijian" >
          <ul class="content" v-for="(v, i) in obj" :key="i">
              <li><div class="toux"><img :src=v.imgurl1 alt=""></div> <span class="name">{{v.name}}</span></li>
              <li>{{v.txt}}</li>
              <li><div class="peitu"><img :src=v.imgurl2 alt=""></div></li>
              <li><div class="didian"><img :src=v.imgurl3 alt=""></div></li>
              <li class="last"><span class="iconfont icon-pinglun"></span> <span class="iconfont icon-zan1"></span></li>
          </ul>
      </div>
  </div>
</template>

<script>
export default {
    data() {
        return {
            obj:[
                {imgurl1:"/tuijian/toux.png",name:"财神道",txt:"杭州机场修了六七年，将互联网之都拉下马，七点半起飞，六点十分登机，是为了让我们在飞机上睡觉吗?",imgurl2:"/tuijian/peitu.png",imgurl3:"/tuijian/didian.png"},
                {imgurl1:"/tuijian/toux2.png",name:"冬天不怕冷",txt:"回不去了，包机的感觉",imgurl2:"/tuijian/peitu3.png",imgurl3:"/tuijian/didian2.png"},
                {imgurl1:"/tuijian/toux3.png",name:"小豆豆",txt:"青岛现在冷吗，要不要穿羽绒服",imgurl2:"/tuijian/peitu2.png",imgurl3:"/tuijian/didian3.png"},
                {imgurl1:"/tuijian/toux4.png",name:"航騜",txt:"早上好！2021年第163次飞行",imgurl2:"/tuijian/peitu4.png",imgurl3:"/tuijian/didian4.png"},
                 {imgurl1:"/tuijian/toux.png",name:"雄安",txt:"回不去了，包机的感觉",imgurl2:"/tuijian/peitu3.png",imgurl3:"/tuijian/didian2.png"},
                //  
                {imgurl1:"/tuijian/toux.png",name:"财神道",txt:"杭州机场修了六七年，将互联网之都拉下马，七点半起飞，六点十分登机，是为了让我们在飞机上睡觉吗?",imgurl2:"/tuijian/peitu.png",imgurl3:"/tuijian/didian.png"},
                {imgurl1:"/tuijian/toux4.png",name:"冬天不怕冷",txt:"回不去了，包机的感觉",imgurl2:"/tuijian/peitu3.png",imgurl3:"/tuijian/didian2.png"},
                {imgurl1:"/tuijian/toux2.png",name:"小豆豆",txt:"青岛现在冷吗，要不要穿羽绒服",imgurl2:"/tuijian/peitu2.png",imgurl3:"/tuijian/didian3.png"},
                {imgurl1:"/tuijian/toux3.png",name:"航騜",txt:"早上好！2021年第163次飞行",imgurl2:"/tuijian/peitu4.png",imgurl3:"/tuijian/didian4.png"},
                 {imgurl1:"/tuijian/toux4.png",name:"雄安",txt:"回不去了，包机的感觉",imgurl2:"/tuijian/peitu3.png",imgurl3:"/tuijian/didian2.png"},

            ]
        }
    },
}
</script>

<style scoped>
.tuijian{
    width: 100%;
    /* height: 1.6rem; */
    /* background-color: wheat; */

}
.toux{
    width: 50px;
    height: 35px;
}
.toux img{
    width: 100%;
    height: 100%;
}
.content li:nth-child(1){
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.name{
    font-size: 16px;
    font-weight: 800;

}
.content li:nth-child(2){
    font-size: 14px;
    margin-left: 40px;

}
.peitu{
    width: 310px;
    height: 110px;
    margin: auto;
    margin-top: 10px ;

}
.peitu img{
    width: 100%;
    height: 100%;
    }
.didian{
    width: 310px;
    height: 55px;
    margin: auto;
} 
.didian img{
    width: 100%;
    height: 100%;
    }
.last{
    width: 310px;
    height: 50px;
    margin: auto;
    }
.last span:nth-child(2){
    margin-left: 50px;
    font-size: 20px;
    /* color: red; */
}
</style>